<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<title>#{get 'title' /}</title>
		
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		
		<link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/main.css'}" />
		<link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/datatable_jui.css'}" />
		<link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/jquery-ui-1.8.4.custom.css'}" />
		<link rel="stylesheet" type="text/css" media="screen" href="@{'/public/javascripts/jquery-ui-1.8.13.custom/css/ui-lightness/jquery-ui-1.8.13.custom.css'}" />
		
		<script src="@{'/public/javascripts/menuDeroulant.js'}" type="text/javascript" ></script>
	    <script src="@{'/public/javascripts/jquery-1.5.min.js'}" type="text/javascript" ></script>
	    <script src="@{'/public/javascripts/DataTables-1.7.5/media/js/jquery.dataTables.js'}" type="text/javascript" ></script>
	    <script type="text/javascript">
		    $(document).ready(function() {
		        oTable = $('.display').dataTable({
		            "bJQueryUI": true,
		            "sPaginationType": "full_numbers"
		        });
		    } );
		    
		    $(document).ready(function(){
		    	$('#main').click(function(){
		    		if(document.getElementById('menu_cis')!=null && document.getElementById('menu_cis').style.display=='block')
	        		{$("#menu_cis").slideToggle('medium');}
		        	if(document.getElementById('menu_candid')!=null && document.getElementById('menu_candid').style.display=='block')
		        		{$("#menu_candid").slideToggle('medium');}
		        	if(document.getElementById('menu_gestion')!=null && document.getElementById('menu_gestion').style.display=='block')
		        		{$("#menu_gestion").slideToggle('medium');}
		        	if(document.getElementById('menu_stage')!=null && document.getElementById('menu_stage').style.display=='block')
	        		{$("#menu_stage").slideToggle('medium');}
		    	});
		    	$('#header').click(function(){
		    		if(document.getElementById('menu_cis')!=null && document.getElementById('menu_cis').style.display=='block')
	        		{$("#menu_cis").slideToggle('medium');}
		        	if(document.getElementById('menu_candid')!=null && document.getElementById('menu_candid').style.display=='block')
		        		{$("#menu_candid").slideToggle('medium');}
		        	if(document.getElementById('menu_gestion')!=null && document.getElementById('menu_gestion').style.display=='block')
		        		{$("#menu_gestion").slideToggle('medium');}
		        	if(document.getElementById('menu_stage')!=null && document.getElementById('menu_stage').style.display=='block')
	        		{$("#menu_stage").slideToggle('medium');}
		        	if(document.getElementById('menu_gestionTerri')!=null && document.getElementById('menu_gestionTerri').style.display=='block')
	        		{$("#menu_gestionTerri").slideToggle('medium');}
       			});
		    });
		    
		    $(document).ready(function () {
		        $('#tab_stage').click(function () {
		        	if(document.getElementById('menu_cis')!=null && document.getElementById('menu_cis').style.display=='block')
		        		{$("#menu_cis").slideToggle('medium');}
		        	if(document.getElementById('menu_candid')!=null && document.getElementById('menu_candid').style.display=='block')
		        		{$("#menu_candid").slideToggle('medium');}
		        	if(document.getElementById('menu_gestion')!=null && document.getElementById('menu_gestion').style.display=='block')
		        		{$("#menu_gestion").slideToggle('medium');}
		        	if(document.getElementById('menu_gestionTerri')!=null && document.getElementById('menu_gestionTerri').style.display=='block')
	        		{$("#menu_gestionTerri").slideToggle('medium');}
        			$("#menu_stage").slideToggle('medium');
		        });
		        $('#menu_stage li').mouseover(function () {
		            $(this).animate({ fontSize: "14px"}, 50 );
		        });
		        $('#menu_stage li').mouseout(function () {
		            $(this).animate({ fontSize: "12px"}, 50 );
		        });
		    });
		    $(document).ready(function () {
		        $('#tab_candid').click(function () {
		        	if(document.getElementById('menu_stage')!=null && document.getElementById('menu_stage').style.display=='block')
		        		{$("#menu_stage").slideToggle('medium');}
		        	if(document.getElementById('menu_cis')!=null && document.getElementById('menu_cis').style.display=='block')
		        		{$("#menu_cis").slideToggle('medium');}
		        	if(document.getElementById('menu_gestion')!=null && document.getElementById('menu_gestion').style.display=='block')
		        		{$("#menu_gestion").slideToggle('medium');}
		        	if(document.getElementById('menu_gestionTerri')!=null && document.getElementById('menu_gestionTerri').style.display=='block')
	        		{$("#menu_gestionTerri").slideToggle('medium');}
        			$("#menu_candid").slideToggle('medium');
		        });
		        $('#menu_candid li a').mouseover(function () {
		            $(this).animate({ fontSize: "14px"}, 50 );
		        });
		        $('#menu_candid li a').mouseout(function () {
		            $(this).animate({ fontSize: "12px"}, 50 );
		        });
		    });
		    $(document).ready(function () {
		        $("#tab_cis").click(function () {
		        	if(document.getElementById('menu_stage')!=null && document.getElementById('menu_stage').style.display=='block')
		        		{$("#menu_stage").slideToggle('medium');}
		        	if(document.getElementById('menu_candid')!=null && document.getElementById('menu_candid').style.display=='block')
		        		{$("#menu_candid").slideToggle('medium');}
		        	if(document.getElementById('menu_gestion')!=null && document.getElementById('menu_gestion').style.display=='block')
		        		{$("#menu_gestion").slideToggle('medium');}
		        	if(document.getElementById('menu_gestionTerri')!=null && document.getElementById('menu_gestionTerri').style.display=='block')
	        		{$("#menu_gestionTerri").slideToggle('medium');}
        			$("#menu_cis").slideToggle('medium');
		        });
		        $('#menu_cis li a').mouseover(function () {
		            $(this).animate({ fontSize: "14px"}, 50 );
		        });
		        $('#menu_cis li a').mouseout(function () {
		            $(this).animate({ fontSize: "12px"}, 50 );
		        });
		    });
		    $(document).ready(function () {
		        $("#tab_gestion").click(function () {
		        	if(document.getElementById('menu_stage')!=null && document.getElementById('menu_stage').style.display=='block')
		        		{$("#menu_stage").slideToggle('medium');}
		        	if(document.getElementById('menu_candid')!=null && document.getElementById('menu_candid').style.display=='block')
		        		{$("#menu_candid").slideToggle('medium');}
		        	if(document.getElementById('menu_cis')!=null && document.getElementById('menu_cis').style.display=='block')
		        		{$("#menu_cis").slideToggle('medium');}
		        	if(document.getElementById('menu_gestionTerri')!=null && document.getElementById('menu_gestionTerri').style.display=='block')
	        		{$("#menu_gestionTerri").slideToggle('medium');}
        			$("#menu_gestion").slideToggle('medium');
		        });
		        $('#menu_gestion li a').mouseover(function () {
		            $(this).animate({ fontSize: "14px"}, 50 );
		        });
		        $('#menu_gestion li a').mouseout(function () {
		            $(this).animate({ fontSize: "12px"}, 50 );
		        });
		    });
		    $(document).ready(function () {
		        $("#tab_gestionTerri").click(function () {
		        	if(document.getElementById('menu_stage')!=null && document.getElementById('menu_stage').style.display=='block')
		        		{$("#menu_stage").slideToggle('medium');}
		        	if(document.getElementById('menu_candid')!=null && document.getElementById('menu_candid').style.display=='block')
		        		{$("#menu_candid").slideToggle('medium');}
		        	if(document.getElementById('menu_cis')!=null && document.getElementById('menu_cis').style.display=='block')
		        		{$("#menu_cis").slideToggle('medium');}
		        	if(document.getElementById('menu_gestion')!=null && document.getElementById('menu_gestion').style.display=='block')
	        		{$("#menu_gestion").slideToggle('medium');}
        			$("#menu_gestionTerri").slideToggle('medium');
		        });
		        $('#menu_gestionTerri li a').mouseover(function () {
		            $(this).animate({ fontSize: "14px"}, 50 );
		        });
		        $('#menu_gestionTerri li a').mouseout(function () {
		            $(this).animate({ fontSize: "12px"}, 50 );
		        });
		    });
		    
		    function pop(){
		    	window.open('/apropos','_blank','toolbar=0, location=0, directories=0, status=0, scrollbars=0, resizable=0, copyhistory=0, menuBar=0, width=600, height=300, left=420 top=250');
		    }
	    </script>    	
		#{set title:'Gestion des stages et des candidatures'/}
	</head>
	
	<body>
		<!-- Entête du site contenant le logo et les liens pour se déconnecter,
		retourner à l'accueuil et voir son profil. -->
		<div id="header">
			<div id="logo">
				<a href="@{Application.index}" alt="Retour au choix de l'application">
					<img id="imglogo" src="@{'/public/images/logo(1).jpg'}" title="Retour &agrave; l'accueil"/>
				</a>
			</div>
			<ul id="tools">
				<b> 
				#{if agent_grade!=null} 
					${agent_grade} 
				#{/if}
				${agent_fullname} </b> |
				<a href="@{Agents.monProfil()}">Mon Profil</a> |
				<a href="@{Secure.logout()}">D&eacute;connexion</a> |
				<a href="@{Application.index()}">Retour &agrave; l'accueil</a> |
				<a href="#" onclick="pop()">&Agrave; propos</a>
			</ul>
		</div>
		
		<!-- Onglets du module de gestion des stages et des candidatures -->
		<div class="tabs" title="Cliquez pour d&eacute;rouler les menus">
			
			<!-- Onglets d'affichage de la liste des stages -->
			<div class="tab">
				<div id="tab_stage" class="${request.action == 'Stages.afficherStatistiques' || request.action == 'Stages.afficherStatistiquesAnneePrec' || request.action == 'Stages.ajouterDatesAdministratives' || request.action == 'Stages.ajouterResponsablesForm' || request.action == 'Stages.annulerStage' || request.action == 'Stages.detailStage' || request.action == 'Stages.gererStagesTermine' || request.action == 'Stages.imprimeListe' || request.action == 'Stages.listStages' || request.action == 'Stages.modifStageForm' || request.action == 'Stages.modifStageAdmin' || request.action == 'Stages.newStageForm' || request.action == 'Stages.statistiques' || request.action == 'Stages.statistiquesAnneePrec' || request.action == 'Stages.validerCompetences'  || request.action == 'Candidats.entrerResultat' || request.action == 'Stages.modifStage' ? 'selected' : ''}" onmouseover="this.style.backgroundColor= 'rgb(255, 120, 18)'" onmouseout="if(this.className!='selected') this.style.backgroundColor=  'rgb(255, 167, 79)'">
					Stages
				</div>
				<img src="@{'/public/images/web168.gif'}" alt="Dérouler le menu" class="flecheBas"/>
				<ul id="menu_stage">
					<li><a href="@{Stages.listStages}">Liste des stages</a></li>
					<li><a href="@{Candidats.candidaterNonPlanifie}">Candidater sur <br /> un stage non planifi&eacute;</a></li>
					#{if admin || gestionnaireFonct}
						<li><a href="@{Stages.gererStagesTermine}">Liste des stages termin&eacute;s <br/>et r&eacute;alis&eacute;s</a></li>
					#{/if}
					#{if admin}
						<li><a href="@{Stages.newStageForm}">Cr&eacute;er un stage</a></li>
						<li><a href="@{Stages.statistiques}">Statistiques de l'ann&eacute;e ${anneeEnCours}</a></li>
						<li><a href="@{Stages.statistiquesAnneePrec}">Statistiques de l'ann&eacute;e ${anneeEnCours-1}</a></li>
					#{/if}
				</ul>
			</div>
			
			<div class="tab">
				<div id="tab_candid" class="${request.action == 'Candidats.candidatures' || request.action == 'Candidats.demandeAnnulation' || request.action == 'Candidats.candidaterNonPlanifie' || request.action == 'Candidats.candidaturesRefusee' || request.action == 'Candidats.candidaturesAttente' || request.action == 'Candidats.candidaturesValidee' || request.action == 'Candidats.candidaturesAnnulee' || request.action == 'Candidats.detailCandid' || request.action == 'Stages.candidStage' ? 'selected' : ''}" onmouseover="this.style.backgroundColor= 'rgb(255, 120, 18)'" onmouseout="if(this.className!='selected') this.style.backgroundColor=  'rgb(255, 167, 79)'">
					Mes candidatures
				</div>
				<img src="@{'/public/images/web168.gif'}" alt="Dérouler le menu" class="flecheBas"/>
				<ul id="menu_candid">
					<li><a href="@{Candidats.candidatures}">Toutes mes candidatures</a></li>
					<li><a href="@{Candidats.candidaturesAttente}">Candidatures en attente</a></li>
					<li><a href="@{Candidats.candidaturesAnnulee}">Candidatures annul&eacute;es</a></li>
					<li><a href="@{Candidats.candidaturesRefusee}">Candidatures refus&eacute;es</a></li>
					<li><a href="@{Candidats.candidaturesValidee}">Candidatures valid&eacute;es</a></li>
				</ul>
			</div>
			#{if chef_CIS}
				#{if nb_demande_auto>0}
					<div class="tab">
						<div id="tab_cis" class="${request.action == 'CISs.autorisationCandidatures' || request.action=='CISs.voirCandid' || request.action=='Candidats.ajouterCandidatureCis' || request.action=='Candidats.listStageAjouterCis' ? 'selected' : ''}" onmouseover="this.style.backgroundColor= 'rgb(255, 120, 18)'" onmouseout="if(this.className!='selected') this.style.backgroundColor=  'rgb(255, 167, 79)'">
							Gestion de votre CIS(${nb_demande_auto})
						</div>
						<img src="@{'/public/images/web168.gif'}" alt="Dérouler le menu" class="flecheBas"/>
						<ul id="menu_cis">
							<li><a href="@{CISs.autorisationCandidatures}">Autoriser candidatures</a></li>
							<li><a href="@{CISs.voirCandid}">Liste des candidatures</a></li>
							<li><a href="@{Candidats.listStageAjouterCis}">Ajouter une candidature</a></li>
						</ul>
					</div>
				#{/if}
				#{else}
					<div class="tab">
						<div id="tab_cis" class="${request.controller == 'CISs' ? 'selected' : ''}" onmouseover="this.style.backgroundColor= 'rgb(255, 120, 18)'" onmouseout="if(this.className!='selected') this.style.backgroundColor=  'rgb(255, 167, 79)'">
							Gestion de votre CIS
						</div>
						<img src="@{'/public/images/web168.gif'}" alt="Dérouler le menu" class="flecheBas"/>
						<ul id="menu_cis">
							<li><a href="@{CISs.autorisationCandidatures()}">Autoriser candidatures</a></li>
							<li><a href="@{CISs.voirCandid}">Liste des candidatures</a></li>
							<li><a href="@{Candidats.listStageAjouterCis}">Ajouter une candidature</a></li>
						</ul>
					</div>
				#{/else}
			#{/if}
			#{if gestionnaireTerri} 
			<div class="tab">
				<div id="tab_gestionTerri" class="${request.action == 'Candidats.listDemandeAnnulationTerri' || request.action == 'Candidats.gestionCandidaturesTerri' || request.action == 'Candidats.validationCandidaturesTerri' || request.action == 'Candidats.gerer' ? 'selected' : ''}" onmouseover="this.style.backgroundColor= 'rgb(255, 120, 18)'" onmouseout="if(this.className!='selected') this.style.backgroundColor=  'rgb(255, 167, 79)'">
				#{if nb_demande_valid_terri>0 || nb_demande_annul_terri>0}
					Gestion du groupement(${nb_demande_valid_terri + nb_demande_annul_terri})
				#{/if}
				#{else}
					Gestion du groupement
				#{/else}
				</div>	
				<img src="@{'/public/images/web168.gif'}" alt="Dérouler le menu" class="flecheBas"/>
				<ul id="menu_gestionTerri">
					#{if nb_demande_valid_terri>0}
						<li><a href="@{Candidats.validationCandidaturesTerri}">Validation candidatures(${nb_demande_valid_terri})</a></li>
					#{/if}
					#{else}
						<li><a href="@{Candidats.validationCandidaturesTerri}">Validation candidatures</a></li>
					#{/else}
					#{if nb_demande_annul_terri>0}
						<li><a href="@{Candidats.listDemandeAnnulationTerri}">Annulations candidatures(${nb_demande_annul_terri})</a></li>
					#{/if}
					#{else}
						<li><a href="@{Candidats.listDemandeAnnulationTerri}">Annulations candidatures</a></li>
					#{/else}
					<li><a href="@{Candidats.gestionCandidaturesTerri}">G&eacute;rer candidatures</a></li>
				</ul>
			</div>
			#{/if}
			#{if gestionnaireFonct || admin} 
			<div class="tab">
				<div id="tab_gestion" class="${request.action == 'Candidats.validationCandidatures' || request.action == 'Candidats.listDemandeAnnulation' || request.action == 'Candidats.gestionCandidatures' || request.action == 'CISs.autorisationCandidaturesAdmin' || request.action == 'Candidats.gerer' || request.action == 'Candidats.ajouterCandidature' ? 'selected' : ''}" onmouseover="this.style.backgroundColor= 'rgb(255, 120, 18)'" onmouseout="if(this.className!='selected') this.style.backgroundColor=  'rgb(255, 167, 79)'">
				#{if nb_demande_valid_admin>0 || nb_demande_annul_admin>0}
					Gestion des candidatures(${nb_demande_valid_admin + nb_demande_annul_admin})
				#{/if}
				#{else}
					Gestion des candidatures
				#{/else}
				</div>
				<img src="@{'/public/images/web168.gif'}" alt="Dérouler le menu" class="flecheBas"/>
				<ul id="menu_gestion">
					<li><a href="@{CISs.autorisationCandidaturesAdmin}">Autoriser des candidatures</a></li>
					#{if nb_demande_valid_admin>0}
					<li><a href="@{Candidats.validationCandidatures}">Validation candidatures(${nb_demande_valid_admin})</a></li>
					#{/if}
					#{else}
					<li><a href="@{Candidats.validationCandidatures}">Validation candidatures</a></li>
					#{/else}
					#{if nb_demande_annul_admin>0}
					<li><a href="@{Candidats.listDemandeAnnulation}">Annulations candidatures(${nb_demande_annul_admin})</a></li>
					#{/if}
					#{else}
					<li><a href="@{Candidats.listDemandeAnnulation}">Annulations candidatures</a></li>
					#{/else}
					<li><a href="@{Candidats.gestionCandidatures}">G&eacute;rer candidatures</a></li>
				</ul>
			</div>
			#{/if}		
		</div>
	
		<!-- Partie du template où seront afficher les différentes pages appelées
		par les contrôleurs. Affiche également les bandeaux de confirmation ou d'erreur. -->
		<div id="main">
			#{if flash.error}
				<p class="error">
				    ${flash.error}
				</p>
			#{/if}
			#{if flash.success}
				<p class="success">${flash.success}</p>
			#{/if}
			#{doLayout /} 
		</div>
		
	</body>
</html>